<da-layout>
  <da-layout-header [class.da-no-logo]="layoutConfig['hideLogo']">
    <da-header-logo *ngIf="
        (layoutConfig.mode === 'headerTop' || isSidebarFold) &&
        !layoutConfig['hideLogo']
      " [shrink]="isSidebarFold"></da-header-logo>
    <span *ngIf="isSidebarFold" class="da-header-collapsed-button" (click)="openSideMenuDrawer()">
      <i class="icon icon-list-view"></i>
    </span>
    <da-navbar *ngIf="layoutConfig.id === 'topNav' && !isSidebarFold" [data]="FifterMenu" [mode]="'top'"
      style="flex: 1 1 0%" (topItemHovered)="handleTopItemHover($event)"></da-navbar>
    <div *ngIf="layoutConfig.id !== 'topNav' || isSidebarFold" style="flex: 1 1 0%"></div>
    <da-header></da-header>
  </da-layout-header>
  <div class="menu-child-top" *ngIf="topChildMenu&&layoutConfig.id === 'topNav' && !isSidebarFold"
    (mouseleave)="topChildMenuOut()">
    <div class="menu-child-item">
      <div class="menu-child-title">
        <span class="menu-child-title-text">{{childeMenu.title}}</span>
      </div>
      <div class="menu-child-body">
        <div class="menu-child-body-text" *ngFor="let item of childeMenu.childrenMenu">
          <a [routerLink]="[item.link]" routerLinkActive="active"><span>{{item.title}}</span></a>
        </div>
      </div>
    </div>
  </div>
  <da-layout-sidebar (mouseleave)="handkeItemHoverOut()">
    <da-header-logo *ngIf="layoutConfig.mode !== 'headerTop' && !layoutConfig['hideLogo']" [shrink]="isSidebarShrink">
    </da-header-logo>
    <da-side-menu *ngIf="!isSidebarShrink" [data]="FifterMenu" (itemHovered)="handkeItemHover($event)"></da-side-menu>
    <div class="chat-ai" *ngIf="!isSidebarShrink" (click)="openAi()">
      <div class="ai-img">
        <img src="../../assets/img/icon/ai.png" alt="" style="height: 50px;">
      </div>
      <div class="ai-text">
        <span>小布AI</span>
      </div>
    </div>
    <div class="ai-da-navbar"  *ngIf="isSidebarShrink">
      <da-navbar *ngIf="isSidebarShrink" [data]="FifterMenu" [mode]="'left'" (itemHovered)="handkeItemHover($event)"></da-navbar>
      <div class="chat-ai" *ngIf="isSidebarShrink">
        <div class="ai-img"  (click)="openAi()">
          <img src="../../assets/img/icon/ai.png" alt="" style="height: 30px;">
        </div>
      </div>
    </div>
    <div class="da-sidebar-tools">
      <ul class="da-sidebar-tools-list">
        <li class="da-sidebar-tools-item" (click)="sidebarShrink(!isSidebarShrink)">
          <i class="icon" [ngClass]="{
              'icon-fold-bar': !isSidebarShrink,
              'icon-unfold-bar': isSidebarShrink
            }"></i>
        </li>
      </ul>
    </div>
    <div class="menu-child" *ngIf="!isSidebarShrink&&clideMenuDisplay" [@fadeInOut]="'out'">
      <div class="menu-child-title">
        <span class="menu-child-title-text">{{childeMenu.title}}</span>
      </div>
      <div class="menu-child-body">
        <d-accordion class="da-menu" [data]="childeMenu.childrenMenu" [linkType]="'routerLink'" [openKey]="'open'"
          [childrenKey]="'childrenMenu'" [accordionType]="'embed'" [autoOpenActiveMenu]="false"></d-accordion>
      </div>
    </div>
    <div class="menu-child2" *ngIf="isSidebarShrink&&clideMenuDisplay" [@fadeInOut]="'out'">
      <div class="menu-child-title">
        <span class="menu-child-title-text">{{childeMenu.title}}</span>
      </div>
      <div class="menu-child-body">
        <d-accordion class="da-menu" [childrenKey]="'childrenMenu'" [data]="childeMenu.childrenMenu"
          [linkType]="'routerLink'" [accordionType]="'embed'" [autoOpenActiveMenu]="false"></d-accordion>
      </div>
    </div>
  </da-layout-sidebar>
  <div class="content">
    <router-outlet></router-outlet>
  </div>
  <da-layout-footer>
    <da-footer></da-footer>
  </da-layout-footer>
</da-layout>
<d-back-top [right]="'20px'" [bottom]="'78px'"></d-back-top>
<!-- <div class="da-multi-settings" (click)="openSettingDrawer()">
  <i class="icon icon-setting"></i>
</div> -->
<!-- <div class="da-personalize-config" (click)="personalizeConfig()">
  <svg
    width="18px"
    height="18px"
    viewBox="0 0 16 16"
  >
    <g
      stroke="none"
      stroke-width="1"
      fill="none"
      fill-rule="evenodd"
    >
      <path
        d="M4.75056114,1.19593773 L15.7107162,12.1560928 L12.8822891,14.98452 L1.92213402,4.02436485 C1.72687187,3.82910271 1.72687187,3.51252022 1.92213402,3.31725807 L4.04345436,1.19593773 C4.23871651,1.00067558 4.555299,1.00067558 4.75056114,1.19593773 Z M7.22543488,5.08502502 L5.81122131,6.49923859 L12.8822891,13.5703064 L14.2965027,12.1560928 L7.22543488,5.08502502 Z M4,10 C4.27614237,10 4.5,10.2238576 4.5,10.5 L4.5,11 L5,11 C5.27614237,11 5.5,11.2238576 5.5,11.5 C5.5,11.7761424 5.27614237,12 5,12 L4.5,12 L4.5,12.5 C4.5,12.7761424 4.27614237,13 4,13 C3.72385763,13 3.5,12.7761424 3.5,12.5 L3.5,12 L3,12 C2.72385763,12 2.5,11.7761424 2.5,11.5 C2.5,11.2238576 2.72385763,11 3,11 L3.5,11 L3.5,10.5 C3.5,10.2238576 3.72385763,10 4,10 Z M1,11 C1.27614237,11 1.5,11.2238576 1.5,11.5 C1.5,11.7761424 1.27614237,12 1,12 C0.723857625,12 0.5,11.7761424 0.5,11.5 C0.5,11.2238576 0.723857625,11 1,11 Z M15,6 C15.2761424,6 15.5,6.22385763 15.5,6.5 C15.5,6.77614237 15.2761424,7 15,7 C14.7238576,7 14.5,6.77614237 14.5,6.5 C14.5,6.22385763 14.7238576,6 15,6 Z M4.39700775,2.2565979 L2.98279419,3.67081146 L5.10411453,5.7921318 L6.51832809,4.37791824 L4.39700775,2.2565979 Z M11,1 C11.2761424,1 11.5,1.22385763 11.5,1.5 L11.5,2 L12,2 C12.2761424,2 12.5,2.22385763 12.5,2.5 C12.5,2.77614237 12.2761424,3 12,3 L11.5,3 L11.5,3.5 C11.5,3.77614237 11.2761424,4 11,4 C10.7238576,4 10.5,3.77614237 10.5,3.5 L10.5,3 L10,3 C9.72385763,3 9.5,2.77614237 9.5,2.5 C9.5,2.22385763 9.72385763,2 10,2 L10.5,2 L10.5,1.5 C10.5,1.22385763 10.7238576,1 11,1 Z"
      ></path>
    </g>
  </svg>
</div> -->
